<template>
	<div id="diary">
		<div class="diary">
			<sectionTitle>{{diary.subject}}</sectionTitle>
			<div v-html="diary.content" class="content"></div>
		</div>
	</div>
</template>

<script>
	import {queryDiary} from '@/api/diary.js'
	import sectionTitle from '@/components/section-title'
	export default {
		data() {
			return {
				diary: {}
			};
		},
		methods: {
			getDiary(){
				queryDiary(this.$route.params.id).then(res => {
					this.diary = res.data;
				})
			}
		},
		components:{
			sectionTitle
		},
		mounted() {
			this.getDiary();
		},
		beforeCreate() {
			this.$bus.emit("setIdx", 4);
		}
	};
</script>

<style>
</style>
<style scoped="scoped" lang="less">
	#diary {
		padding: 100px;
		padding-bottom: 40px;
		padding-top: 120px !important;
		.diary{
			background-color: #FFFFFF;
			padding: 20px;
		}
		.content{
			text-indent: 20px;
		}
	}
</style>
